import { message } from "@/utils/message";
import { applyCertificate } from "@/api/certificate";
import { computed } from "vue";
import { getExhibitorId } from "@/utils/getExhibitorId";

// 需是hooks写法（函数中有return），避免失去响应性
export function useColumnsHistory(
  certificateListHistory: any,
  handleRefreshCurrentCallback?: () => void
) {
  const tableDataHistory = computed(() => certificateListHistory.value || []);
  const columnsHistory: TableColumnList = [
    {
      label: "姓名",
      prop: "username",
      width: 120
    },
    {
      label: "性别",
      prop: "gender",
      width: 80,
      cellRenderer: ({ row }) => {
        // 支持数字和字符串类型
        const gender = row.gender;
        let genderText = "未知";
        let genderColor = "#909399";

        if (gender === 0 || gender === "0") {
          genderText = "男";
          genderColor = "#409EFF";
        } else if (gender === 1 || gender === "1") {
          genderText = "女";
          genderColor = "#E6A23C";
        }

        return (
          <span style={`color: ${genderColor}; font-weight: 500;`}>
            {genderText}
          </span>
        );
      }
    },
    {
      label: "单位",
      prop: "unit",
      width: 150
    },
    {
      label: "职务",
      prop: "job",
      width: 120
    },
    {
      label: "手机",
      prop: "telephone",
      width: 140
    },
    {
      label: "邮箱",
      prop: "email",
      width: 200
    },
    {
      label: "身份证",
      prop: "id_card",
      width: 180
    },
    {
      label: "现居住地址",
      prop: "addres1",
      width: 250
    },
    {
      label: "户籍地详址",
      prop: "addres2",
      width: 250
    },
    {
      label: "照片",
      prop: "photo",
      width: 100,
      cellRenderer: ({ row }) => {
        const photoUrl = row.photo
          ? `https://exhibition-bucket.oss-cn-beijing.aliyuncs.com${row.photo}`
          : "/placeholder-avatar.png";
        return (
          <img
            src={photoUrl}
            alt="照片"
            style="width: 50px; height: 50px; object-fit: cover; border-radius: 4px;"
          />
        );
      }
    },
    {
      label: "操作",
      fixed: "right",
      width: 170,
      cellRenderer: ({ row }) => (
        <>
          <el-button
            type="danger"
            round
            onClick={() => handleAddToCurrent(row)}
          >
            添加到本届
          </el-button>
        </>
      )
    }
  ];

  const handleAddToCurrent = async (row: any) => {
    try {
      // 组装申请证件所需数据（根据后端入参调整字段映射）
      const payload: any = {
        id: row.id,
        exhibitor_id: getExhibitorId() || 0,
        username: row.username,
        gender: row.gender,
        unit: row.unit,
        job: row.job,
        telephone: row.telephone,
        email: row.email,
        id_card: row.id_card,
        addres1: row.addres1,
        addres2: row.addres2,
        photo: row.photo,
        status: 3
      };
      const res: any = await applyCertificate(payload);
      if (res?.code === 1) {
        message("添加到本届成功", { type: "success" });
        // 刷新本届列表
        handleRefreshCurrentCallback && handleRefreshCurrentCallback();
      } else {
        message(res?.msg || "添加到本届失败", { type: "error" });
      }
    } catch (e) {
      console.error(e);
      message("添加到本届失败", { type: "error" });
    }
  };

  return {
    columnsHistory,
    tableDataHistory
  };
}
